import type { Directive, DirectiveBinding } from 'vue';

const display: Directive = {
    mounted(el: HTMLElement, binding: DirectiveBinding) {
        let name = el.dataset.name;
        let handle = (e: any) => {
            //判断点击的是不是该盒子
            let flag = !el.contains(e.target); // true 当前盒子
            switch (name) {
                case 'jieFang':
                    binding.value.isShowJieFang = flag;
                    break;
                case 'daiFang':
                    binding.value.isShowDaiFang = flag;
                    break;
                case 'zhaoYao':
                    binding.value.isShowZhaoYao = flag;
                    break;
                case 'kuaiJi':
                    binding.value.isShowKuaiJi = flag;
                    break;
                default:
                    break;
            }

            // console.log(binding.value);
        };

        document.addEventListener('click', handle);
    },
};

export default display;
